<?php
//Inclusion du header de la page
include 'header.php';
// Récupéaration des variables pour l'initialisation de la page
if (isset($_GET['lat'], $_GET['long'], $_GET['id'])) {
    $lat = ($_GET['lat']);
    $long = ($_GET['long']);
    $id = ($_GET['id']);
} else {
    $lat = 0;
    $long = 0;
    $id = 0;
}
?>


<!--        <link rel="stylesheet" href="CSS/layout.css" type="text/css" media="screen" />-->
<!--[if lt IE 9]>
<link rel="stylesheet" href="css/ie.css" type="text/css" media="screen" />
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

<script src="JS/hideshow.js" type="text/javascript"></script>
<script src="JS/jquery.tablesorter.min.js" type="text/javascript"></script>
<script type="text/javascript" src="JS/jquery.equalHeight.js"></script>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript" src="JS/gestionMap.js"></script>
<script type="text/javascript" src="JS/gestionActivite.js"></script>
<script type="text/javascript" src="JS/requeteAjax.js"></script>
<!--        <script type="text/javascript" src="JS/jquery-ui-1.8.20.custom.min.js"></script>-->
<script type="text/javascript">
    
    var latitude = "<?php echo $lat; ?>";
    var longitude = "<?php echo $long; ?>";
    var id = "<?php echo $id; ?>";
 
</script>

<script type="text/javascript">
    $(document).ready(function() 
    { 
        $(".tablesorter").tablesorter(); 
    } 
);
    $(document).ready(function() {

        //When page loads...
        $(".tab_content").hide(); //Hide all content
        $("ul.tabs li:first").addClass("active").show(); //Activate first tab
        $(".tab_content:first").show(); //Show first tab content

        //On Click Event
        $("ul.tabs li").click(function() {

            $("ul.tabs li").removeClass("active"); //Remove any "active" class
            $(this).addClass("active"); //Add "active" class to selected tab
            $(".tab_content").hide(); //Hide all tab content

            var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content
            $(activeTab).fadeIn(); //Fade in the active ID content
            return false;
        });
    });
</script>
<script type="text/javascript">
    $(function(){
        $('.column').equalHeight();
    });
</script>

</head>

<body>

    <header id="header">
        <hgroup>
            <h1 class="site_title"><a href="index.html">Projet BIMSITE</a></h1>
            <h2 class="section_title">Edition de parcours de chasse au trésor</h2><div class="btn_view_site">
                <!--                            <a href="http://www.medialoot.com">View Site</a>-->
            </div>
        </hgroup>
    </header> <!-- end of header bar -->

    <div id="boxes">

        <!-- Liste des sites de la base pouvant être modifiés -->
        <div id="dialog" class="window">
            <article class="module width_full">
                <header><h3>Liste des sites</h3></header>
                <div class="module_content">
                    <div>
                        <p>Choisissez un site</p>
                        <ul id="lienSite"></ul>
                    </div>
                </div>
                <footer>
                    <div class="submit_link">
                        <input type="submit" value="Annuler" class="close">
                        <a href="creationSite.php"><input type="submit" value="Nouveau site" class="alt_btn"></a>
                    </div>
                </footer>
            </article>
        </div>

        <!-- Liste des sites de la base pouvant être modifiés -->
        <div id="creationParcours" class="window">
            <article class="module width_full">
                <header><h3>Création des parcours</h3></header>

                <form id="addParcours" class="form" action="#" method="post" >
                    <fieldset>
                        <label for="pointDepart">Point de départ du parcours</label>
                        <select name="pointDepart" id="pointDepart"></select>
                    </fieldset>
                    <fieldset>
                        <div>
                            <label>Temps du parcours</label>
                            <input type="text" id="temps"/> 
                        </div>

                        <div> <div id="slider-range"></div></div>
                    </fieldset>
                    <fieldset>
                        <label>Profil des membres</label>
                        <table>
                            <tr>
                                <td>Enfant poussette</td>
                                <td>Enfant 5-9 ans</td>
                                <td>Enfant 10-13 ans</td>
                                <td>Mobilité réduite</td>
                            </tr>
                            <tr>
                                <td><input id="enfant1" type="checkbox"/></td>
                                <td><input id="enfant2" type="checkbox"/></td>
                                <td><input id="enfant3" type="checkbox"/></td>
                                <td><input id="mobiliteR" type="checkbox"/></td>
                            </tr>
                        </table>
                    </fieldset>
                    <footer>
                        <div class="submit_link">
                            <input type="submit" value="Annuler" class="close">
                            <input type="submit" class="alt_btn" value="Générer parcours"/>
                        </div>
                    </footer>
                </form>
            </article>
        </div>

        <div id="marker" class="window">
            <article class="module width_full">
                <header><h3>Informations point</h3></header>
                <form id="addMarker" class="form" action="#" method="post" >
                    <div class="module_content">
                        <fieldset>
                            <label for="lat">Latitude</label>
                            <input type="text" name="lat" id="lat" value="" readonly="readonly"/><br />
                        </fieldset>
                        <fieldset>
                            <label for="long">Longitude</label>
                            <input type="text" name="long" id="long" value="" readonly="readonly"/><br />
                        </fieldset>
                        <fieldset>
                            <label for="point">Nom</label>
                            <input type="text" name="point" id="point" value="" required="required"/><br/>
                        </fieldset>
                        <fieldset>
                            <label for="depart">D&eacute;part</label>
                            <input type="checkbox" id='depart' name="depart" value=""/><br/>
                        </fieldset>
                        <fieldset>
                            <label for="descr">Description</label>
                            <textarea name="descr" id="descr" rows="4" cols="20" required="required"></textarea>
                            <br />
                        </fieldset>
                        <footer>
                            <div class="submit_link" id="validationPoint">
                                <a href='#' id='clear'>Vider les champs</a>
                                <input type="button" id="annuler" value="Annuler" class="close"/>
                                <input type="submit" id="ajout" value="Ajouter ce point" class="alt_btn"/>                             
                            </div>
                        </footer>
                    </div>
                </form>
            </article>
        </div>


        <!-- Masque pour masquer l'ensemble de l'écran -->
        <div id="mask"></div>

    </div>

    <section id="secondary_bar">
        <div class="user">
            <p> <?php
session_start();

// On teste si la variable de session existe et contient une valeur
if (empty($_SESSION['username'])) {
// Si inexistante ou nulle, on redirige vers le formulaire de login
    header('Location: identification.php');
    exit();
}
echo "" . $_SESSION['username'] . "   (";
echo "<a id='deconnexion' href='logout.php'>Deconnexion</a>)"
?></p>
            <!-- <a class="logout_user" href="#" title="Logout">Logout</a> -->
        </div>
        <div class="breadcrumbs_container">
            <article class="breadcrumbs"><a href="#">Gestion de Site</a> <div class="breadcrumb_divider"></div> <a class="current">Modification de site</a></article>
        </div>
    </section><!-- end of secondary bar -->

    <aside id="sidebar" class="column">
        <form class="quick_search">
            <input type="text" value="Quick Search" onfocus="if(!this._haschanged){this.value=''};this._haschanged=true;">
        </form>
        <hr/>
        <h3>Gestion Site</h3>
        <ul class="toggle">
            <li class="icn_new_article"><a href="creationSite.php">Création de site</a></li>
            <li class="icn_edit_article"><a href="#dialog" name="modal">Modification de site</a></li>               
        </ul>
        <h3>Utilisateurs</h3>
        <ul class="toggle">
            <li class="icn_add_user"><a href="ajouterUser.php">Ajout d'un utilisateur</a></li>
            <li class="icn_view_users"><a href="users.php">Liste des utilisateurs</a></li>
        </ul>
        <h3>Admin</h3>
        <ul class="toggle">
            <li class="icn_settings"><a href="#">Options</a></li>
            <li class="icn_security"><a href="#">Security</a></li>
            <li class="icn_jump_back"><a href="#">Logout</a></li>
        </ul>

        <footer><hr />

        </footer>
    </aside><!-- end of sidebar -->

    <section id="main" class="column">

        <!--            <h4 class="alert_info">Welcome to the free MediaLoot admin panel template, this could be an informative message.</h4>-->

        <article class="module width_quarter">
            <header><h3>Actions</h3></header>
            <div class="module_content">
                <ul>
                    <li><a href="#" id="genererGraph">Générer graphe</a></li>
                    <li><a href="#" id="supprimerGraph">Supprimer graphe</a></li>
                    <!--                    <li><a href="#" id="importerGraph">Importer</a></li>-->
                    <li><a href="genererXml.php?Fichier_a_telecharger=texte.txt" id="exporterGraph">Exporter graphe</a></li>
                    <li><a href="#" id="creerParcours">Créer parcours</a></li>
                </ul>
                <div class="clear"></div>
            </div>
        </article>

        <article class="module width_3_quarter">
            <header><h3>Site</h3></header>
            <div class="module_content">
                <div id="map_canvas" class="gmap3"></div>
                <div class="clear"></div>
            </div>
        </article><!-- end of stats article -->


        <article id="articleGraph" class="module width_3_quarter">
            <header><h3>Denivellé du parcours</h3></header>
            <div class="module_content">
                <div id='elevationGraf'></div>
                <div class="clear"></div>
            </div>
        </article>

        <article id="statParcours" class="module width_quarter">
            <header><h3>Informations du parcours</h3></header>
            <div class="module_content">
                <div id="distancetotal"></div>
                <div id="tempstotal"></div>
                <div class="clear"></div>
            </div>
        </article>

        <div class="spacer"></div>

        <article class="module width_half">
            <header><h3 class="tabs_involved">éléments du graphe</h3>
                <ul class="tabs">
                    <li><a href="#tab1">Points</a></li>
                    <li><a href="#tab2">Arcs</a></li>
                </ul>
            </header>

            <div class="tab_container">
                <div id="tab1" class="tab_content">
                    <table id="list" class="tablesorter" cellspacing="0"> 
                        <thead> 
                            <tr> 
                                <th>Nom Point</th> 
                                <th>Actions</th> 
                            </tr> 
                        </thead> 
                        <tbody> 
                        </tbody> 
                    </table>
                </div><!-- end of #tab1 -->

                <div id="tab2" class="tab_content">
                    <table id="table_Arc" class="tablesorter" cellspacing="0"> 
                        <thead> 
                            <tr> 
                                <th>Nom Arc</th>
                                <th>Actions</th> 
                            </tr> 
                        </thead> 
                        <tbody> 
                    </table>

                </div><!-- end of #tab2 -->

            </div><!-- end of .tab_container -->

        </article><!-- end of content manager article -->
        <article class="module width_half">
            <header><h3 class="tabs_involved">Activités</h3>

            </header>

            <div class="tab_container">
                <div id="tab3">
                    <table id="listA" class="tablesorter" cellspacing="0"> 
                        <thead> 
                            <tr> 
                                <th>Nom Point</th> 
                                <th>Nom Activité</th> 
                                <th>Actions</th> 
                            </tr> 
                        </thead> 
                        <tbody> 
                        </tbody> 
                    </table>
                </div><!-- end of #tab1 -->
            </div>
        </article>

        <div class="clear"></div>



        <!--            <h4 class="alert_warning">A Warning Alert</h4>
        
                    <h4 class="alert_error">An Error Message</h4>
        
                    <h4 class="alert_success">A Success Message</h4>-->
    </section>

    <div id="boxes">

        <div id="gestionActivite" class="window">
            <article class="module width_full">
                <header><h3>Ajouter quizz</h3></header>
                <form method="post" id="gestionA" class="form" title="Ajout d'une activité" action="#">
                    <div class="module_content">
                        <a href="#"><input type="button" value="+" id="addQ"/></a>
                        <a href="#"><input type="button" value="-" id="supprQ"/></a>
                        <br />
                        <input type="button" id="buttonUpload" value="Upload" />
                        <div id="output">
                            <ul id="output-listing"></ul>
                        </div>
                        <fieldset>
                            <label>Nom</label><input type="text" name="nomQ" id="nomQ" value="" required="required"/><br />
                        </fieldset>
                        <div id="contenu">
                            <fieldset id="div1">
                                <div class="div" id="div1">
                                    <div class="div">
                                        <label style="width:10px;">Question</label>
                                        <br /><br />
                                        <input type="text" name="question" id="question1" value="" style="width:200px" required="required"/>
                                        <input type="file" name="imageQ1" id="imageQ1" value="" onChange="getLien();"/>
                                        <input type="checkbox" id="checkQ1" name="1" value="" />
                                    </div>
                                    <br />
                                    <div class="div">
                                        <label style="width:10px;">Propositions</label>
                                        <br /><br />
                                        <label style="width:10px;">1-</label>
                                        <input type="text" name="reponse" id="reponse1" value="" style="width:200px" required="required"/>
                                        <input type="file" id="imgR1" value="" onChange="getLien();"/>
                                        <input type="checkbox" id="checkR1" value="" />
                                    </div>
                                    <br />
                                    <div class="div">
                                        <label style="width:10px;">2-</label>
                                        <input type="text" name="reponse" id="reponse2" value="" style="width:200px" required="required"/>
                                        <input type="file" id="imgR2" value="" onChange="getLien();"/>
                                        <input type="checkbox" id="checkR2" name="checkR2" value="" />
                                    </div>
                                    <br />
                                    <div class="div">
                                        <label style="width:10px;">3-</label>
                                        <input type="text" name="reponse" id="reponse3" value="" style="width:200px" required="required"/>
                                        <input type="file" id="imgR3" value="" onChange="getLien();"/>
                                        <input type="checkbox" id="checkR3" name="checkR3" value="" />
                                    </div>
                                </div>
                            </fieldset>
                        </div>
                    </div>
                    <div id="validationQuizz" class="button">
                        <input type="submit" id="submitQuizz" value="Soumettre le quizz" class="alt_btn"/>
                        <input type="submit" value="Fermer" class="close">
                    </div>
                    </div>
                </form>
            </article>
        </div>

    </div>

    <!-- Div qui va contenir les boutons permettant de choisir le type d'activité-->
    <div id="boxes">

        <div id="typeA" class="window">
            <article class="module width_full">
                <header><h3>Choix d'un type d'activités</h3></header>
                <form method="post" id="typeActivite" class="form" title="Choix d'une activité" action="#">
                    <fieldset id="fieldA">
                        <div id="contenu">
                            <input type="button" value="Quizz" id="typeQuizz" class="alt_btn"/>
                            <input type="button" value="Chaud-Froid" id="typeCF" class="alt_btn"/>
                            <input type="button" value="Temps Limité" id="typeTL" class="alt_btn"/><br /><br />
                            <input type="submit" value="Fermer" class="close">
                        </div>
                    </fieldset>
                </form>
            </article>
        </div>

    </div>

    <!-- formulaire pour le temps limité -->
    <div id="boxes">
        <div id="temps_limite" class="window">
            <article class="module width_full">
                <header><h3>Temps Limité</h3></header>
                <form method="post" id="TL" class="form" title="Ajout d'un TL" action="#">
                    <div id="contenu">
                        <div class="div">
                            <label>Choix d'un arc</label>
                            <select id="choixArc">
                                <option id="1" value="1">arc 1</option>
                                <option id="2" value="1">arc 2</option>
                                <option id="3" value="1">arc 3</option>
                            </select><br /><br />
                            <label>Temps (en minutes)</label>
                            <input type="text" id="minute" name="minute" value="" required="required"/>
                            <br />
                            <br />
                            <input type="submit" id="submitTL" value="Soumettre" class="alt_btn" />
                            <input type="submit" id="closeTL" value="Fermer" class="close">
                        </div>
                    </div>
                </form>
        </div>
    </div>

    <!--formulaire pour chaud-froid-->
    <div id="boxes">
        <div id="chaud_froid" class="window">
            <article class="module width_full">
                <header><h3>Chaud Froid</h3></header>
                <form method="post" id="CF" class="form" title="Choix d'une activité" action="#">
                    <div id="contenu">
                        <div class="div">
                            <label>Choix d'un arc</label>
                            <select id="choixArcCF">
                                <option id="1" value="arc1">arc 1</option>
                                <option id="2" value="arc2">arc 2</option>
                                <option id="3" value="arc3">arc 3</option>
                            </select><br /><br />
                            <label>Précision (en mètre)</label>
                            <input type="text" id="precision" name="precision" value="" required="required"/>
                            <br />
                            <br />
                            <input type="submit" id="submitCF" value="Soumettre" class="alt_btn"/>
                            <input type="submit" id="close" value="Fermer" class="close">
                        </div>
                    </div>
                </form>
        </div>
    </div>
</body>
</html>
